<template>
	<view style="position: relative;height: 100%; " :class="{'disabled':disabled==true}">
		<view class="" style="background-color: #fff;line-height: 40px;color: #666;padding: 0 10px;">
			<uni-icons type="shop" style="font-weight: bold;"></uni-icons> {{addressTitle}}
		</view>
		<uni-list>
			<uni-list-item v-for="item,index in carList" :key="index" :title="item.cInvName"
				:note="'￥'+momenyFormat(item.iInvRCost)" :thumb="item.Picture?item.Picture:'/static/none.png'"
				thumb-size="lg">
				<template v-slot:footer>
					<view class="footerCheck">
						<view>
							× {{item.Quantity}}
						</view>
						<button type="warn" size="mini" class="delBtn" @click="delCarListItem(index)">
							<uni-icons type="trash-filled" color="#fff"></uni-icons>
						</button>
					</view>
				</template>
			</uni-list-item>
		</uni-list>
		<view class="goodsPrice">
			共 {{all.rows}} 件商品,合计:<text class="fuhao">￥</text><text class="price">{{momenyFormat(all.price)}}</text>
		</view>
		<view style="height: 62px">

		</view>
		<view class="bottom">
			<view>
				<text style="margin-right: 10px;">占用额度: <text class="fuhao">￥</text><text
						class="price">{{momenyFormat(all.price)}}</text></text>
				<br />
				<text>剩余额度: <text class="fuhao">￥</text><text
						class="price">{{ newUsedamount ==null?momenyFormat(all.num):momenyFormat(newUsedamount) }}</text></text>
			</view>
			<button type="primary" class="submit" @click="submit" v-if="isTrue">
				提交
			</button>
			<button type="warn" class="but-warn" v-if="!isTrue" @click="openInfo">
				额度不足
			</button>
		</view>
	</view>
</template>

<script>
	import {
		momenyFormat
	} from '@/utils/utils.js'
	import {
		mapState,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				disabled: false,
				addressTitle: uni.getStorageSync('shopInfo').Title,
				show: false,
				value: '',
				data: [],
				momenyFormat,
				shopInfo: {},
				userInfo: {},
				currentDate: "",
				buyShopInfo: {},
				// 公司信息
				CompanyInfo: {},
				Usedamount: 0,
				// 上个页面传递过来的所有参数
				entity: {},
				newUsedamount: null
			}
		},

		onLoad(options) {
			// 初始化最新的剩余总额度
			this.newUsedamount = null
			console.log('settlesettlesettlesettlesettle=======', options)
			this.entity = options
			this.Usedamount = options.Usedamount
			this.currentDate = options.currentDate
			this.shopInfo = uni.getStorageSync('shopInfo')
			this.userInfo = uni.getStorageSync('userInfo')

			// 获取公司信息
			this.GetDataCompanyData()
		},


		onBackPress() {
			const pages = getCurrentPages();
			let prepage = pages[pages.length - 2]
			// let newTypeData= prepage.$vm.typeData
			// 刷新上个页面的列表数据
			prepage.$vm.getTypeList()
			console.log('获取上个页面参数', prepage)
		},
		computed: {
			...mapState(['carList']),
			all() {
				let price = 0
				let rows = 0
				this.carList.forEach(item => {
					price += (Number(item.iInvRCost) || 0) * Number(item.Quantity)
					rows += Number(item.Quantity)
				})
				return {
					price,
					num: this.Usedamount - price,
					rows
				}
			},
			isTrue() {
				let num = this.all
				let number = this.newUsedamount == null ? num.num : this.newUsedamount
				console.log()
				if (Number(number) > 0) {
					return true
				} else {
					return false
				}
			},
		},
		methods: {
			...mapMutations(['delCarListItem', 'clearCarList']),
			//额度为负数弹窗
			openInfo() {
				uni.showToast({
					icon: 'error',
					title: '额度不足，请重新选择商品！'
				})

			},
			// 获取可用额度数据
			GetQuota() {
				console.log('获取可用额度', this.entity, this.userInfo)
				this.$http('post', '/Base/Base_Quota/GetQuota?CreatorId=' + this.userInfo.Id + '&Compayid=' + this
					.entity
					.Id + '&CompanyName=' + this.entity.Title + '&BankId=' + this.entity.BankId).then(res => {
					if (res.Success) {
						console.log('获取可用额度数据settled页面', res)
						this.newUsedamount = res.Data.Totalamount - res.Data.Usedamount
					} else this.$api.msg(res.Msg)
				})
			},
			// 获取公司信息
			GetDataCompanyData() {
				var that = this
				// 获取公司信息
				this.$http("post", "/Base_Manage/Base_Company/GetDataCompanyData", {
						Search: {
							condition: "CreatorId",
							keyword: this.userInfo.Id,
						},
					})
					.then((res) => {
						console.log('获取公司信息', res);
						if (res.Success && res.Data.length > 0) {
							this.CompanyInfo = res.Data[0];
							uni.setStorageSync('CompanyInfo', this.CompanyInfo)
							// 获取店铺信息
							this.$http('post', '/Base_Manage/Base_Company/GetTheData?id=' + this.CompanyInfo.Id)
								.then(
									res => {
										if (res.Success) {
											this.buyShopInfo = res.Data
										}
									})
						}


					});
			},
			submit() {
				console.log('获取对比额度111', this.disabled)
				if (!this.carList.length > 0) {
					uni.showToast({
						icon: 'none',
						title: '请添加商品后提交'
					})
					return
				}
				// 如果下单了禁用后续流程  防止频繁点击
				if (this.disabled == true) {
					return
				}
				var that = this
				uni.showModal({
					title: '提示',
					content: '您确定要提交吗?',
					success: (val) => {
						if (val.cancel) return
						uni.showLoading({
							title: '提交中'
						})
						this.$http('post', '/BO/ApplicationForm/SaveApplicationFormData', {
							"Period": this.currentDate,
							"Phone": this.userInfo.cPhone,
							"CreatorId": this.userInfo.Id,
							"CreditAmount": this.all.price,
							"CompanyId": this.shopInfo.Id,
							"CreditNum": this.all.rows,
							"BuyerStoreId": this.buyShopInfo.Id,
							"detaillist": this.carList.map(item => {
								return {
									"TypeName": "",
									"InventId": item.Id,
									"Price": item.iInvRCost,
									"Quantity": item.Quantity,
									"Money": Number(item.iInvRCost) * Number(item
										.Quantity),
									"Remarks": "",
									"CreatorId": item.CreatorId,
									"Deleted": true,
									"Picture": item.Picture,
									"InventName": item.cInvName
								}
							})
						}).then(res => {
							if (res.Success) {
								uni.hideLoading()
								this.$store.commit('setOrderId', res.Data)
								this.clearCarList()
								uni.showToast({
									mask: true,
									title: '订单已上传至商家,请等待商家确认',
									icon: 'none'
								})
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/Order/OrderInfoDetail?Id=' +
											res
											.Data + '&back=true'
									})
								}, 1800)
								// 获取可用额度
								that.GetQuota()
								console.log('获取对比额度222', this.all, this.Usedamount)
								// 禁用
								this.disabled = true
							} else this.$api.msg(res.Msg)
						})
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.disabled {
		opacity: 0.5;
	}

	::v-deep.uni-list-item__content-note {
		color: #333;
	}

	.fuhao {
		font-size: 12px;
	}

	.price {
		font-size: 16px;
		font-weight: bold;
	}

	.footerCheck {
		display: flex;
		flex-direction: column;
		align-items: flex-end;

		.delBtn {
			margin: 0;
			height: 24px;
			line-height: 24px;
			margin-top: 5px;
		}
	}

	.goodsPrice {
		text-align: right;
		background-color: #fff;
		line-height: 40px;
		padding: 0 10px;
		color: #333;
	}

	.bottom {
		box-sizing: border-box;
		padding: 0 15px;
		position: fixed;
		bottom: 0;
		background-color: #fff;
		width: 100%;
		height: 62px;
		display: flex;
		align-items: center;
		justify-content: space-between;

		.submit {
			margin: 0;
			background-image: linear-gradient(to right, #38FFCB, #2979FF);
			width: 100px;
			border-radius: 40px;
			height: 40px;
			line-height: 40px;
			font-size: 30rpx;
			font-weight: bold;
		}

		.but-warn {
			margin: 0;
			background-image: linear-gradient(90deg, #f19a96, #c92d2c);
			width: 100px;
			border-radius: 40px;
			height: 40px;
			line-height: 40px;
			font-size: 30rpx;
			font-weight: bold;

		}
	}
</style>